﻿<%@ page language="C#" autoeventwireup="true" inherits="Training.Web.Forms.Administration.Catalog.PesertaForm, App_Web_gub3wqo5" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>City Form</title>
    <script src="<%= ResolveUrl("~/scripts/jquery.validate.min.js") %>" type="text/javascript"></script>
    <script src="<%= ResolveUrl("~/scripts/jquery.validate.wrapper.js") %>" type="text/javascript"></script>
    <script src="<%= ResolveUrl("~/scripts/jquery.inputmask.bundle.min.js") %>" type="text/javascript"></script>
    <script src="<%= ResolveUrl("~/scripts/jquery.msgBox.v1.js") %>" type="text/javascript"></script>
    <script src="<%= ResolveUrl("~/scripts/chosen/chosen.jquery.min.js") %>" type="text/javascript"></script>
    <link href="<%= ResolveUrl("~/styles/chosen/chosen.min.css") %>" rel="stylesheet"
        type="text/css" />
    <script type="text/javascript">

        $("#btnSave").button({ icons: { primary: "ui-icon-disk"} });
        $("#btnClose").button({ icons: { primary: "ui-icon-close"} });

        $('#btnClose').click(function () {
            parent.$('#dialog').dialog("close");
        });
 
    </script>
    <script type="text/javascript">

        $(document).ready(function () {

            $('#txtNIK').focus();


            // 1. prepare the validation rules and messages.
            var rules = {
                txtNama: "required",
                txtNIK: "required",
                ddlBagian: "required",
                ddlJabatan: "required",
                ddlDepartment: "required"

            };
            var messages = {
                txtNama: "Nama Peserta wajib di isi",
                ddlDepartment: "Departemen wajib di isi",
                txtNIK: "NIK Peserta wajib di isi",
                ddlBagian: "Bagian Peserta wajib di isi",
                ddlJabatan: "Jabatan Peserta wajib di isi"
            };

            //            $("#txtDescription").inputmask("Regex", { regex: "[A-Za-z-.0-9 ]*" });

            // 2. Initiate the validator
            var validator = new jQueryValidatorWrapper("form1", rules, messages);

            // 3. Set the click event to do the validation
            $("#btnSave").click(function () {

                if (!validator.validate())
                    return;


                var nama = $('#txtNama').val();
                var nik = $('#txtNIK').val();
                var bagian = $("#ddlBagian option:selected").val();
                var jabatan = $("#ddlJabatan option:selected").val();
                var id = $('#<%= hfID.ClientID %>').val();

                var objrecPeserta = new Object();
                objrecPeserta.PesertaID = id;
                objrecPeserta.NIK = encodeURIComponent(nik);
                objrecPeserta.NamaPeserta = encodeURIComponent(nama);
                objrecPeserta.PositionID = encodeURIComponent(jabatan);
                objrecPeserta.BagianID = encodeURIComponent(bagian);


                jsonData = JSON.stringify(objrecPeserta);

                var handlerUrl = '<%= ResolveUrl("~/ajaxhandler/administration/catalog/Pesertahandler.ashx") %>';

                if (id == 0)
                    CallAjax(handlerUrl, "?method=insert", jsonData);
                else {
                    CallAjax(handlerUrl, "?method=update", jsonData);
                }

                parent.$('#dialog').dialog('close');

                setTimeout("parent.$('#table').trigger('reloadGrid');", 3000);

                return false;
            });



            $('#ddlDepartment').change(function () {
                var handlerUrl = '<%= ResolveUrl("~/AjaxHandler/Loaddata/Administration/catalog/BagianLoadHandler.ashx") %>';
                var departmentID = $("#ddlDepartment option:selected").val();

                if (departmentID != "") {

                    //load bagian by departemenid
                    var $ddlBagian = $('#ddlBagian');
                    $('#ddlBagian').find('option:not(:first)').remove();

                    $.ajax({
                        type: 'POST',
                        url: handlerUrl + "?method=getbydepartment&departmentID=" + departmentID,
                        contentType: 'application/json',
                        dataType: 'json',
                        success: function (datas) {
                            $ddlBagian.get(0).options[0] = new Option("-- pilih bagian --", "");

                            $.each(datas, function (i, data) {
                                $ddlBagian.append('<option value="' + data.BagianID + '">' + data.NamaBagian + '</option>');
                            });

                            $ddlBagian.trigger('chosen:updated');
                        },
                        error: function () {
                            //alert('Error load bagian !');

                            $.msgBox("Error load bagian  !", null, { title: "Pesan Error" });
                        }
                    });

                    //END


                    //load Jabatan by departemenid
                    handlerUrl = '<%= ResolveUrl("~/AjaxHandler/Loaddata/Administration/catalog/PositionLoadHandler.ashx") %>';
                    var $ddlJabatan = $('#ddlJabatan');
                    $('#ddlJabatan').find('option:not(:first)').remove();

                    $.ajax({
                        type: 'POST',
                        url: handlerUrl + "?method=getbydepartment&departmentID=" + departmentID,
                        contentType: 'application/json',
                        dataType: 'json',
                        success: function (datas) {
                            $ddlJabatan.get(0).options[0] = new Option("-- pilih jabatan --", "");

                            $.each(datas, function (i, data) {
                                $ddlJabatan.append('<option value="' + data.PositionID + '">' + data.PositionName + '</option>');
                            });

                            $ddlJabatan.trigger('chosen:updated');
                        },
                        error: function () {
                            $.msgBox("Error load jabatan  !", null, { title: "Pesan Error" });
                        }
                    });

                    //END
                }
            });

        });
    
    </script>
    <script type="text/javascript">

        function ClearText() {
            $('#txtNama').val('');
            $('#txtTgl').val('');
            $('#txtTempat').val('');
        }
        
         
    </script>
    <script type="text/javascript">

        $(document).ready(function () {
            $('#<%= ddlDepartment.ClientID %>').chosen({ placeholder_text_single: "-- pilih departemen --" });
            $('#<%= ddlBagian.ClientID %>').chosen({ placeholder_text_single: "-- pilih bagian --" });
            $('#<%= ddlJabatan.ClientID %>').chosen({ placeholder_text_single: "-- pilih jabatan --" });

        });

    </script>
</head>
<body onload="ClearText();">
    <form id="form1" runat="server">
    <table border="0">
      <tr>
            <td valign="top">
                NIK
            </td>
            <td valign="top">
                :
            </td>
            <td>
                <asp:TextBox ID="txtNIK" MaxLength="100" runat="server" Width="300"></asp:TextBox>&nbsp;<span
                    style="color: Red;">*</span>
            </td>
        </tr>
        <tr>
            <td valign="top">
                Nama Peserta
            </td>
            <td valign="top">
                :
            </td>
            <td>
                <asp:TextBox ID="txtNama" MaxLength="100" runat="server" Width="300"></asp:TextBox>&nbsp;<span
                    style="color: Red;">*</span>
            </td>
        </tr>
        <tr>
            <td valign="top">
              Departemen
            </td>
            <td valign="top">
                :
            </td>
            <td>
               <asp:DropDownList ID="ddlDepartment" runat="server" Width="400"></asp:DropDownList> &nbsp;<span
                    style="color: Red;">*</span>
            </td>
        </tr>

         <tr>
            <td valign="top">
              Bagian
            </td>
            <td valign="top">
                :
            </td>
            <td>
               <asp:DropDownList ID="ddlBagian" runat="server" Width="400"></asp:DropDownList> &nbsp;<span
                    style="color: Red;">*</span>
            </td>
        </tr>
        <tr>
            <td valign="top">
              Jabatan
            </td>
            <td valign="top">
                :
            </td>
            <td>
               <asp:DropDownList ID="ddlJabatan" runat="server" Width="400"></asp:DropDownList> &nbsp;<span
                    style="color: Red;">*</span>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                &nbsp;
            </td>
            <td>
               <%-- <br />
                <br />
                <br />
                <br />
                <br />
                <br />
                <br />
                <br />--%>
                <div style="text-align: right; padding-top: 10px;">
                    <button id="btnSave" type="button">
                        Save</button>
                    <button id="btnClose" type="button">
                        Close</button>
                </div>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                &nbsp;
            </td>
            <td>
                <asp:HiddenField ID="hfID" runat="server" />
            </td>
        </tr>
    </table>
    </form>
</body>
</html>
